<template>
  <div class="flex-row container-fluid w-100 h-100 p-0 m-0">
    <div v-for="cloindex in numcol" :key=cloindex class="flex-column">
      <div v-for="rowindex in numrow" :key=rowindex :class="[vdata.onpc?'flex-item':'flex-item-ph']">
        <div class="card bg-secondary text-white">
          <div class="card-header" :class="[vdata.onpc?'score-header':'score-header-ph']">{{getscorecard(cloindex, rowindex).title}}</div>
          <div class="card-body" :class="[vdata.onpc?'score-body':'score-body-ph']">
            <div class="row" v-for="(item, index) of getscorecard(cloindex, rowindex).data" :key=index>
              <div class="col-4" style="color:Orange">{{item.label}}</div>
              <div class="col-8" :style="{color:item.tcolor}">{{item.text}}</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
/* eslint-disable comma-dangle */
export default {
  data: function () {
    return {
      vdata: this.gdata.data,
      score: null,
    }
  },
  components: {
  },
  methods: {
    getprop: function (name) {
      return this.score.DictProp[this.confem.confemProp[name]]
    },
    getpropcbt: function (name) {
      return this.score.DictPropCbt[this.confem.confemPropCbt[name]]
    },
    getscorecard: function (col, row) {
      var result = this.datascore[(row - 1) * 2 + (col - 1)]
      return result
    },
    G2C: function (pid, rsp, success, result) {
      switch (pid) {
        case 'G2C_CHAR_SCORE':
          this.score = rsp.InfoScore
          break
        default:
          // 这里是没有找到对应的值处理
          break
      }
    }
  },
  computed: {
    numcol: function () {
      return 2
    },
    numrow: function () {
      return this.datascore.length / 2
    },
    datascore: function () {
      if (this.score === null) {
        return []
      }
      var conflevel = this.confex.cfglevel(this.score.Level)
      return [
        {
          title: '状态',
          data: [
            { label: '食物', text: this.getprop('food') + ' / ' + this.getprop('mxfood') },
            { label: '饮水', text: this.getprop('water') + ' / ' + this.getprop('mxwater') },
            { label: '气血', text: this.getprop('kee') + ' / ' + this.getprop('efkee') + ' / ' + this.getprop('mxkee') },
            { label: '精神', text: this.getprop('sen') + ' / ' + this.getprop('efsen') + ' / ' + this.getprop('mxsen') },
            { label: '内力', text: this.getprop('force') + ' / ' + this.getprop('mxforce') },
            { label: '法力', text: this.getprop('mana') + ' / ' + this.getprop('mxmana') },
          ]
        },
        {
          title: '天赋',
          data: [
            { label: '体格', text: this.getprop('str') + ' + ' + this.getprop('adstr') },
            { label: '悟性', text: this.getprop('itn') + ' + ' + this.getprop('aditn') },
            { label: '根骨', text: this.getprop('con') + ' + ' + this.getprop('adcon') },
            { label: '灵性', text: this.getprop('spi') + ' + ' + this.getprop('adspi') },
            { label: '容貌', text: this.getprop('per') + ' + ' + this.getprop('adper') },
            { label: '福缘', text: this.getprop('kar') + ' + ' + this.getprop('adkar') },
          ]
        },
        {
          title: '角色信息',
          data: [
            { label: 'Uid', text: this.score.Puid },
            { label: '姓名', text: this.score.Name },
            { label: '性别', text: this.score.Gender },
            { label: '年龄', text: this.score.Age },
            { label: '门派', text: this.score.Family },
            { label: '头衔', text: this.score.Title },
            { label: '道行', text: conflevel.Desc + '(' + this.score.Exp + ')', tcolor: conflevel.Color },
            { label: '潜能', text: this.score.Pot },
          ]
        },
        {
          title: '战斗属性',
          data: [
            { label: '基础伤害', text: this.getpropcbt('damage') },
            { label: '基础护甲', text: this.getpropcbt('armor') },
            { label: '战斗攻击', text: this.getpropcbt('attack') },
            { label: '战斗防御', text: this.getpropcbt('defence') },
            { label: '战斗闪躲', text: this.getpropcbt('dodge') },
            { label: '战斗招架', text: this.getpropcbt('parry') },
            { label: '内功修为', text: this.getpropcbt('force') },
            { label: '法术修为', text: this.getpropcbt('spell') },
          ]
        },
      ]
    }
  }
}
</script>

<style scoped>
.flex-row {
  flex-grow: 1;
  display: flex;
}
.flex-column {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.flex-item {
  flex-grow: 1;
  margin: 5px;
}
.flex-item-ph {
  flex-grow: 1;
  font-size: 10px;
}
.score-header {
  text-align: center;
  font-size: 20px;
}
.score-header-ph {
  text-align: center;
  font-size: 15px;
}
.score-body {
  text-align: center;
  font-size: 15px;
}
.score-body-ph {
  text-align: center;
  font-size: 10px;
  margin: 2px;
  padding: 2px;
}
</style>
